import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:macnov/common/loading.dart';
import 'package:macnov/common/progress_bar.dart';
import 'package:macnov/models/company.dart';
import 'package:macnov/role_owner/wallet/components/line_chart.dart';
import 'package:macnov/role_owner/wallet/components/pie_chart.dart';
import 'package:macnov/stores/wallet.dart';
import 'package:macnov/utils/colorUtil.dart';
import 'package:macnov/utils/stringUtil.dart';

class Summary extends StatelessWidget {
  Widget _buildLine() {
    return Container(
      margin: EdgeInsets.only(top: 10, bottom: 10),
      height: 0.5,
      color: ColorsUtil.hexColor(0xDEDDE2),
    );
  }

  Widget _buildItem(String title, String value) {
    return Container(
      padding: EdgeInsets.only(top: 10, bottom: 10),
      alignment: Alignment.centerLeft,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(
            title,
            style:
                TextStyle(color: ColorsUtil.hexColor(0x989898), fontSize: 12),
            textAlign: TextAlign.left,
          ),
          Padding(
            padding: EdgeInsets.only(top: 10),
            child: Text(
              value,
              style: TextStyle(
                  color: ColorsUtil.hexColor(0x020202),
                  fontSize: 20,
                  fontWeight: FontWeight.bold),
              textAlign: TextAlign.left,
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildProgressBar() {
    CreditInfoModel creditInfo = walletStore.creditInfo;
    return Padding(
      padding: EdgeInsets.only(top: 10, bottom: 10),
      child: ProgressWidget(creditInfo.currentBalance,creditInfo.availableCredit,creditInfo.availableCredit),
    );
  }

  ///curve
  Widget _buildChartCurve(context) {
    return SummaryLineChart();
  }

  Widget _buildPieChart() {
    return SummaryPie();
  }

  @override
  Widget build(BuildContext context) {
    return ListView(
      shrinkWrap: true,
      children: <Widget>[
        Observer(
          builder: (_) => (walletStore.allDataReady == false)
              ? Loading()
              : Container(
                  padding: EdgeInsets.fromLTRB(15, 20, 15, 20),
                  color: Colors.white,
                  child: Column(
                    children: <Widget>[
                      Row(
                        children: <Widget>[
                          Text(
                            'CREDIT LIMIT',
                            style: TextStyle(
                                fontSize: 12,
                                color: ColorsUtil.hexColor(0x282828)),
                          ),
                          Expanded(
                            child: Text(
                                r'$' + '${StringUtil.decimalFormat(walletStore.creditInfo.creditLimit)}',
                                textAlign: TextAlign.right,
                                style: TextStyle(
                                    fontSize: 20,
                                    color: ColorsUtil.hexColor(0x161920),
                                    fontWeight: FontWeight.bold)),
                          )
                        ],
                      ),
                      _buildProgressBar(),
                      Padding(
                        padding: EdgeInsets.only(top: 10),
                        child: Row(
                          children: <Widget>[
                            Text(
                              'BALANCE',
                              style: TextStyle(
                                  fontSize: 12,
                                  color: ColorsUtil.hexColor(0x9B9B9B)),
                            ),
                            Expanded(
                              child: Text(
                                'AVAILABLE',
                                textAlign: TextAlign.right,
                                style: TextStyle(
                                    fontSize: 12,
                                    color: ColorsUtil.hexColor(0x9B9B9B)),
                              ),
                            )
                          ],
                        ),
                      ),
                      Padding(
                        padding: EdgeInsets.only(top: 10),
                        child: Row(
                          children: <Widget>[
                            Text(
                              r'$' + '${walletStore.creditInfo.currentBalance}',
                              style: TextStyle(
                                  fontSize: 20,
                                  color: ColorsUtil.hexColor(0x282828),
                                  fontWeight: FontWeight.bold),
                            ),
                            Expanded(
                              child: Text(
                                  r'$' +
                                      '${walletStore.creditInfo.availableCredit}',
                                  textAlign: TextAlign.right,
                                  style: TextStyle(
                                      fontSize: 20,
                                      color: ColorsUtil.hexColor(0x161920),
                                      fontWeight: FontWeight.bold)),
                            )
                          ],
                        ),
                      ),
                      _buildLine(),
                      _buildItem(
                          'AVAILABLE TO CREATE BUDGETS',
                          r'$' +
                              '${walletStore.accountInfo.availableToAssign}'),
                      _buildItem('TOTAL BUDGET',
                          r'$' + '${walletStore.accountInfo.totalBudgetGoal}'),
                      _buildItem('NUMBER OF ACTIVE BUDGETS',
                          '${walletStore.accountInfo.numOfActiveBudget}'),
                      _buildItem('NUMBER OF VIRTUAL CARDS',
                          '${walletStore.accountInfo.numberOfMyVCard}'),
                      _buildItem('NUMBER OF PHYSUCAL CARDS',
                          '${walletStore.accountInfo.numberOfMyPCard}'),
                      _buildItem(
                          'TOTAL VIRTUAL CARD LIMIT',
                          r'$' +
                              '${walletStore.accountInfo.myTotalVCardlimit}'),
                      _buildLine(),
                      _buildChartCurve(context),
                      _buildPieChart(),
                    ],
                  ),
                ),
        )
      ],
    );
  }
}
